<template>
	<div class="publicpageview">
		<div class="publicformview">
			<el-form :inline="true" :model="listQuery" size="mini" ref="searchForm">
				<el-row :gutter="20">
					<el-col :span="5">
						<el-form-item label="申请人：" prop="name">
							<el-input v-model="listQuery.name"></el-input>
						</el-form-item>
					</el-col>
					<el-col :span="5">
						<el-form-item label="状态：" prop="cqdw">
							<el-select v-model="listQuery.cqdw">
								<el-option label="拒绝" value="-1"></el-option>
								<el-option label="审核中" value="0"></el-option>
								<el-option label="审核通过" value="1"></el-option>
							</el-select>
						
						</el-form-item>
					</el-col>
					
					<el-col :span="4">
						<div>
							<el-button size="mini" type="primary" @click="sumbitCx">查询</el-button>
							<el-button size="mini" @click="resetTop">重置</el-button>
						</div>
					</el-col>
				</el-row>
			</el-form>
		</div>

		<div class="publitableview">
			<el-table max-height='500px' v-loading="listLoading" :data="list" border fit highlight-current-row size="mini">

				<el-table-column align="center" label="申请人" prop="userName">
				</el-table-column>

				<el-table-column align="center" label="权限名称" prop="permission">
				</el-table-column>

				<el-table-column align="center" label="生效时间" prop="startTime">
					<template slot-scope="scope">
						{{scope.row.startTime?scope.row.startTime.split(' ')[0]:''}}
					</template>
				</el-table-column>

				<el-table-column align="center" label="失效时间" prop="endTime">
					<template slot-scope="scope">
						{{scope.row.endTime?scope.row.endTime.split(' ')[0]:''}}
					</template>
				</el-table-column>
				
				<el-table-column align="center" label="申请缘由" prop="remake">
					
				</el-table-column>
				
				<el-table-column align="center" label="状态" prop="state">
					<template slot-scope="scope">
						{{scope.row.state==0?'申请中':scope.row.state==1?'申请通过':'申请拒绝'}}
					</template>
				</el-table-column>

				<el-table-column align="center" label="操作" width="280">
					<template slot-scope="scope" v-if="scope.row.state==0">
						<el-button type="text" size="mini" @click="handleUpdate(scope.row.id,1)">通过</el-button>
						<el-button type="text" size="mini" @click="handleUpdate(scope.row.id,-1)">拒绝</el-button>
						<!-- <el-button type="text" size="mini" @click="handleDelete(scope.row.autoid)">删除</el-button> -->
					</template>
				</el-table-column>
			</el-table>

			<div class="publicpaginationview">
				<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
					:current-page="listQuery.pageNum" background :page-sizes="[10, 20, 50, 100]" :page-size="listQuery.pageSize"
					layout="total, sizes, prev, pager, next, jumper" :total="total" small></el-pagination>
			</div>
		</div>
	</div>
</template>

<script>
	import {
		permissionApplyList,
		permissionReview
	} from '@/api/industry'
	export default {
		name: "quanxianguanliliebiao",

		data() {
			return {
				listQuery: {
					pageNum: 1,
					pageSize: 20,
					state:-2,
					userName:''
				},
				total: 0,
				options: [{
					key: "1"
				}],
				list: [],
				listLoading: false,
				dialogVisible: false,
				chaifenVisible: false,
				formData: {
					buyertype:'',
					renteridno:'',
					contractid:'',
					inputdate:'',
					memo:'',
					renter:''
				},
				type: '',
				cfType: '',
				autoid:''
			};
		},

		computed: {
		},

		mounted() {
			this.permissionApplyList()
		},

		methods: {
			permissionApplyList(){
				let data = {
					state:this.listQuery.state,
					userName:this.listQuery.userName,
					pageNum:this.listQuery.pageNum,
					pageSize:this.listQuery.pageSize,
					type:1
				}
				this.listLoading = true;
				permissionApplyList(data).then(res=>{
					this.list = res.data.list
					this.total = res.data.total
					this.listLoading = false;
				})
			},
			handleSizeChange(val) {
				this.listQuery.pageNum = 1;
				this.listQuery.pageSize = val;
				this.permissionApplyList()
			},
			handleCurrentChange(val) {
				this.listQuery.pageNum = val;
				this.permissionApplyList()
			},
			handleUpdate(id,type){
				let data = {
					id:id,
					state:type
				}
				this.$confirm('此操作将审核该条内容，请确认是否继续操作？', '审核提示', {
					confirmButtonText: '确定',
					cancelButtonText: '取消',
					type: 'warning'
				}).then(() => {
					permissionReview(data).then(res=>{
						console.log(res)
						this.$message({
							type: 'success',
							message: '操作成功!'
						});
						this.permissionApplyList()
						
					})
				}).catch(() => {
					this.$message({
						type: 'info',
						message: '已取消审核'
					});
				});
			},
			resetForm(val) {
				console.log("1");
				this.$refs[val].resetFields();
			},

			
			// 查询
			sumbitCx() {
					this.permissionApplyList()
			},
			// 重置
			resetTop() {
			this.listQuery.userName = '',
			this.listQuery.state = '-2'
			},
			handleDelete(e) {
				this.$confirm('此操作将删除该条内容，请确认是否继续操作？', '删除提示', {
					confirmButtonText: '确定',
					cancelButtonText: '取消',
					type: 'warning'
				}).then(() => {
					let data = {
						autoid: e
					}
					delStaffDetail(data).then(res => {
						this.$message({
							type: 'success',
							message: '删除成功!'
						});
						this.popupreset()
					})
				}).catch(() => {
					this.$message({
						type: 'info',
						message: '已取消删除'
					});
				});
			},
			handleClose(done) {
				this.$confirm('确认关闭？')
					.then(_ => {
						done();
					})
					.catch(_ => {});
			}
		},
	};
</script>
<style scoped>
	.saveContent {
		width: 100%;
		display: flex;
		justify-content: end;
		margin-top: 20px;
		padding-bottom: 20px;
	}

	.title {
		color: #008C93;
		text-align: center;
		margin-bottom: 20px;
		font-weight: bold;
	}

	.cfguanpian {
		padding-bottom: 20px;
		color: #008C93;
		margin-bottom: 20px;
		font-weight: bold;
	}

	.title2 {
		color: #008C93;
		margin-bottom: 20px;
		font-weight: bold;
	}

	.tianjiaButton {
		border: 2px solid #008C93;
		background-color: #fff;
		color: #008C93;
	}
</style>